<template>
	<div>
		<!-- 面包屑导航 -->
		<el-breadcrumb separator-class="el-icon-arrow-right">
			<el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
			<el-breadcrumb-item>客户系统</el-breadcrumb-item>
			<el-breadcrumb-item>网络学生</el-breadcrumb-item>
		</el-breadcrumb>
		<!-- 卡片式图 -->
		<el-card class="box-card">
			<!-- 搜索添加区 -->
				<el-form :inline="true" :model="formInline" class="demo-form-inline">
          <el-form-item label="用户名">
            <el-input v-model="formInline.Name" placeholder=""></el-input>
          </el-form-item>
          <el-form-item label="请选择性别">
            <el-select v-model="formInline.Sex" placeholder="请选择性别">
              <el-option label="请选择" value=""></el-option>
              <el-option label="男" value="男"></el-option>
              <el-option label="女" value="女"></el-option>
            </el-select>
          </el-form-item>

				<el-form-item>
					<el-button type="success" @click="search()">搜索</el-button>
					<el-button type="primary" @click="exportData">导出excel</el-button>
					<el-button type="primary" @click="dialogAddFormVisible=true">添加</el-button>
				</el-form-item>
			</el-form>
			<div v-show="menuVisible" :style="{ top: top + 'px', left: left + 'px' }" class="menu1">
				<el-checkbox-group v-model="colOptions"><el-checkbox v-for="item in colSelect" :key="item" :label="item" /></el-checkbox-group>
			</div>


			<!-- <el-dropdown>
				<span class="el-dropdown-link">
					显示/隐藏
					<i class="el-icon-arrow-down el-icon--right"></i>
				</span>
				<el-dropdown-menu slot="dropdown">
					<el-checkbox-group v-model="colOptions"><el-checkbox v-for="item in colSelect" :key="item" :label="item" /></el-checkbox-group>
				</el-dropdown-menu>
			</el-dropdown> -->
			 <el-button  type="" class="el-icon-s-operation" click  @click="EditdialogFormVisibles=true" >移除或添加</el-button>
			 <el-button v-if="piliang" type="primary" @click="setUser()">批量设置咨询师</el-button>
			<el-table :data="userchecklist" @selection-change="handleSelectionChange" border stripe style="width: 100%" fit @header-contextmenu="contextmenu">
				<el-table-column type="selection" width="55"></el-table-column>
				<el-table-column v-if="this.colData[0].istrue" prop="Id" label="编号" width="70"></el-table-column>
				<el-table-column v-if="this.colData[1].istrue" prop="Name" label="用户名" width="180"></el-table-column>
				<el-table-column v-if="this.colData[2].istrue" prop="Sex" label="性别"></el-table-column>
				<el-table-column v-if="this.colData[3].istrue" prop="Age" label="年龄"></el-table-column>
				<el-table-column v-if="this.colData[4].istrue" prop="LearnForward" label="学习方向"></el-table-column>
				<!-- <el-table-column prop="StuState" label="学生状态"></el-table-column> -->
				<el-table-column v-if="this.colData[5].istrue" prop="MsgSource" label="备注"></el-table-column>
				<el-table-column v-if="this.colData[6].istrue" prop="ZiXunName" show-overflow-tooltip label="咨询师"></el-table-column>
				<el-table-column v-if="this.colData[7].istrue" prop="QQ" label="QQ" show-overflow-tooltip></el-table-column>
				<el-table-column v-if="this.colData[8].istrue" prop="WeiXin" label="微信" show-overflow-tooltip></el-table-column>
				<el-table-column v-if="this.colData[9].istrue" prop="Phone" label="电话" show-overflow-tooltip></el-table-column>
				<el-table-column v-if="this.colData[10].istrue" prop="IsValid" label="是否有效"></el-table-column>
				<el-table-column v-if="this.colData[11].istrue" prop="IsReturnVist" label="回访情况" show-overflow-tooltip></el-table-column>
				<el-table-column v-if="this.colData[12].istrue" prop="CreateTime" show-overflow-tooltip label="创建时间"></el-table-column>
				<el-table-column v-if="this.colData[13].istrue" prop="HomeTime" show-overflow-tooltip label="上门时间"></el-table-column>
				<el-table-column label="操作" fixed="right" width="200">
					<template slot-scope="scope">
						<el-button type="infor" size="mini" @click="studetail(scope.row)">详情</el-button>
						<el-button type="warning" size="mini" @click="edit(scope.row.Id)">编辑</el-button>
						<!-- <el-button type="danger" size="mini" @click="del(scope.row.Id)">删除</el-button>
						<el-button type="primary" size="mini" @click="Gen(scope.row.Id)">跟踪</el-button>
						<el-button type="infor" size="mini" @click="log(scope.row.Id)">日志</el-button> -->
					</template>
				</el-table-column>
			</el-table>
			<!-- 分页区 -->
			<el-pagination
				v-on:size-change="sizechange"
				v-on:current-change="pagechange"
				:current-page="page"
				:page-sizes="[5, 10, 15]"
				:page-size="100"
				layout="total, sizes, prev, pager, next, jumper"
				:total="count"
			></el-pagination>
			<el-dialog title="编辑" :visible.sync="dialogFormVisible">
				<el-form :model="form" label-width="100px">
					<el-form-item label="姓名"><el-input v-model="form.Name" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="性别"><el-input v-model="form.Sex" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="年龄"><el-input v-model="form.Age" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="电话"><el-input v-model="form.Phone" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="学历"><el-input v-model="form.StuStatus" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="个人状态"><el-input v-model="form.PerState" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="QQ"><el-input v-model="form.QQ" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="微信" v-if="show"><el-input v-model="form.WeiXin" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="是否访问:">
						<el-switch v-model="form.IsValid" active-color="#13ce66" active-value="是" inactive-value="否" active-text="是" inactive-text="否"></el-switch>
					</el-form-item>
					<el-form-item label="是否回访">
						<el-switch v-model="form.IsReturnVist" active-color="#13ce66" active-value="是" inactive-value="否" active-text="是" inactive-text="否"></el-switch>
					</el-form-item>
					<el-form-item label="是否上门">
						<el-switch v-model="form.IsHome" active-color="#13ce66" active-value="是" inactive-value="否" active-text="是" inactive-text="否"></el-switch>
					</el-form-item>
					<el-form-item label="是否支付">
						<el-switch v-model="form.IsPay" active-color="#13ce66" active-value="是" inactive-value="否" active-text="是" inactive-text="否"></el-switch>
					</el-form-item>
					<el-form-item label="金额"><el-input v-model="form.Money" autocomplete="off"></el-input></el-form-item>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click="dialogFormVisible = false">取 消</el-button>
					<el-button type="primary" @click="editset">确 定</el-button>
				</div>
			</el-dialog>
			<el-dialog title="查看" :visible.sync="lookdialogFormVisible">
				<el-form :model="form" label-width="100px">
					<el-form-item label="姓名"><el-input v-model="form.Name" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="性别"><el-input v-model="form.Sex" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="年龄"><el-input v-model="form.Age" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="电话"><el-input v-model="form.Phone" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="学历"><el-input v-model="form.StuConcern" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="个人状态"><el-input v-model="form.PerState" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="QQ"><el-input v-model="form.QQ" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="微信" v-if="show"><el-input v-model="form.WeiXin" autocomplete="off"></el-input></el-form-item>
					<el-form-item label="是否访问:">
						<el-switch v-model="form.IsValid" active-color="#13ce66" active-value="是" inactive-value="否" active-text="是" inactive-text="否"></el-switch>
					</el-form-item>
					<el-form-item label="是否回访">
						<el-switch v-model="form.IsReturnVist" active-color="#13ce66" active-value="是" inactive-value="否" active-text="是" inactive-text="否"></el-switch>
					</el-form-item>
					<el-form-item label="是否上门">
						<el-switch v-model="form.IsHome" active-color="#13ce66" active-value="是" inactive-value="否" active-text="是" inactive-text="否"></el-switch>
					</el-form-item>
					<el-form-item label="是否支付">
						<el-switch v-model="form.IsPay" active-color="#13ce66" active-value="是" inactive-value="否" active-text="是" inactive-text="否"></el-switch>
					</el-form-item>
					<el-form-item label="金额"><el-input v-model="form.Money" autocomplete="off"></el-input></el-form-item>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click="lookdialogFormVisible = false">取 消</el-button>
					<el-button type="primary" @click="editset">确 定</el-button>
				</div>
			</el-dialog>


			<el-dialog title="编辑"  ref="dialog__wrapper"  :visible.sync="EditdialogFormVisibles" :close-on-click-modal="false" :close-on-press-escape="false">
				<el-row :gutter="20">
				
				<el-dropdown>
				<span class="el-dropdown-link">
					显示/隐藏
					<i class="el-icon-arrow-down el-icon--right"></i>
				</span>
				<el-dropdown-menu slot="dropdown">
					<el-checkbox-group v-model="colOptions"><el-checkbox v-for="item in colSelect" :key="item" :label="item" /></el-checkbox-group>
				</el-dropdown-menu>
			</el-dropdown>
				</el-row>
				<div slot="footer" class="dialog-footer">
					<el-button type="danger" size="mini" @click="EditdialogFormVisibles = false">保存</el-button>
				</div>
    		</el-dialog>
			<!-- 查看 -->

			<el-dialog title="查看所有" :visible.sync="dialogSelectFormVisible">
				<el-form :model="editform" label-width="100px">
					<el-form-item label="姓名"><el-input disabled v-model="editform.Name" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="性别"><el-input disabled v-model="editform.Sex" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="年龄"><el-input disabled v-model="editform.Age" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="电话"><el-input disabled v-model="editform.Phone" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="学历"><el-input disabled v-model="editform.StuConcern" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="个人状态"><el-input disabled v-model="editform.PerState" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="QQ"><el-input disabled v-model="editform.QQ" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="微信"><el-input disabled v-model="editform.WeiXin" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="是否访问:">
						<el-switch disabled v-model="editform.IsValid" active-color="#13ce66" active-value="是" inactive-value="否" active-text="是" inactive-text="否"></el-switch>
					</el-form-item>

					<el-form-item label="是否回访">
						<el-switch
							disabled
							v-model="editform.IsReturnVist"
							active-color="#13ce66"
							active-value="是"
							inactive-value="否"
							active-text="是"
							inactive-text="否"
						></el-switch>
					</el-form-item>

					<el-form-item label="是否上门">
						<el-switch disabled v-model="editform.IsHome" active-color="#13ce66" active-value="是" inactive-value="否" active-text="是" inactive-text="否"></el-switch>
					</el-form-item>

					<el-form-item label="是否支付">
						<el-switch disabled v-model="editform.lsPay" active-color="#13ce66" active-value="是" inactive-value="否" active-text="是" inactive-text="否"></el-switch>
					</el-form-item>

					<el-form-item label="金额"><el-input disabled v-model="editform.Money" autocomplete="off"></el-input></el-form-item>
				</el-form>
			</el-dialog>
			<!-- 跟踪 -->

			<!-- 跟踪 -->
			<el-dialog title="跟踪学生" :visible.sync="dialogGenFormVisible" @close="Gendialogclosed">
				<el-form :model="Genform" ref="GenFormRef">
					<el-form-item label="学生编号" prop="StudentId" :label-width="formLabelWidth" >
						<el-input v-model="Genform.StudentId" :value="Genform.StudentId" auto-complete="off" :disabled="true"></el-input>
					</el-form-item>
					<el-form-item label="学生姓名" prop="StudentName" :label-width="formLabelWidth" >
						<el-input v-model="Genform.StudentName" :value="Genform.StudentName" auto-complete="off" :disabled="true"></el-input>
					</el-form-item>
					<el-form-item label="跟踪方式" prop="FollowType" :label-width="formLabelWidth">
						<el-input v-model="Genform.FollowType" auto-complete="off"></el-input>
					</el-form-item>
					<el-form-item label="回访情况" prop="FollowState" :label-width="formLabelWidth">
						<el-input v-model="Genform.FollowState" auto-complete="off"></el-input>
					</el-form-item>
					<el-form-item label="跟踪时间" prop="FollowTime" :label-width="formLabelWidth">
						 <el-date-picker v-model="Genform.FollowTime" type="datetime" placeholder="选择日期"></el-date-picker>
					</el-form-item>
					<el-form-item label="内容" prop="Content1" :label-width="formLabelWidth">
						<el-input v-model="Genform.Content1" auto-complete="off"></el-input>
					</el-form-item>
					<el-form-item label="下次跟踪时间" prop="NextFollowTime" :label-width="formLabelWidth">
						<el-date-picker v-model="Genform.NextFollowTime" type="datetime" placeholder="选择日期"></el-date-picker>
					</el-form-item>
					<el-form-item label="咨询师名称" :label-width="formLabelWidth">
						<el-select v-model="Genform.AskerId" placeholder="请选择咨询师">
						      <el-option v-for="item in ZiXunShiList" :label="item.AskerName" :value="item.AskerId"></el-option>
						</el-select>
					</el-form-item>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click="dialogGenFormVisible = false">取 消</el-button>
					<el-button type="primary" @click="GenUser">确 定</el-button>
				</div>
			</el-dialog>

			<!-- 我的学生日志 -->

			<el-dialog :before-close="addClassClose" :close-on-click-modal="false" width="1200px" title="日志" :visible.sync="dialogDayFormVisible">
				<!-- 表单 -->

				<el-form :inline="true" ref="stuFormRef" :model="dayformInline" class="demo-form-inline">
					<el-form-item label="选择时间段">
						<el-date-picker v-model="dayformInline.startTime" type="date" value-format="yyyy-MM-dd 00:00:00" placeholder="选择日期"></el-date-picker>
					</el-form-item>

					<el-form-item label="-">
						<el-date-picker v-model="dayformInline.endTime" type="date" value-format="yyyy-MM-dd 00:00:00" placeholder="选择日期"></el-date-picker>
					</el-form-item>
					<el-form-item label="访问类型" :label-width="formfollowLabelWidth">
						<el-select v-model="dayformInline.FollowType" placeholder="选择">
							<el-option label="全部" value=""></el-option>
							<el-option label="面谈" value="面谈"></el-option>
							<el-option label="家访" value="家访"></el-option>
						</el-select>
					</el-form-item>

					<el-form-item><el-button type="primary" @click="sousuo">查询</el-button></el-form-item>
				</el-form>

				<!-- 表格 -->

				<el-table :data="daytableData" border style="width: 100%">
					<el-table-column prop="StudentName" label="姓名" width="180"></el-table-column>
					<el-table-column prop="CreateTime" label="日期" width="180"></el-table-column>
					<el-table-column prop="FollowTime" label="跟踪时间" width="180"></el-table-column>
					<el-table-column prop="NextFollowTime" label="下次跟踪时间" width="180"></el-table-column>

					<el-table-column prop="UserId" label="访问者"></el-table-column>
					<el-table-column prop="Content" label="访问内容"></el-table-column>
					<el-table-column prop="FollowType" label="访问方式"></el-table-column>
					<el-table-column label="操作">
						<template slot-scope="scope">
							<el-button class="el-icon-more" size="mini" @click="lookvisible(scope.row)">查看</el-button>
						</template>
					</el-table-column>
				</el-table>
				<!-- 分页区 -->
				<el-pagination
					v-on:size-change="sizechange2"
					v-on:current-change="pagechange2"
					:current-page="page2"
					:page-sizes="[5, 10, 15]"
					:page-size="100"
					layout="total, sizes, prev, pager, next, jumper"
					:total="count2"
				></el-pagination>

				<div slot="footer" class="dialog-footer"><el-button type="primary" @click="addClassClose">关闭</el-button></div>
			</el-dialog>

			<el-dialog title="查看" :visible.sync="dialoglookvisible">
				<el-form :model="lookform" label-width="100px">
					<el-form-item label="姓名"><el-input disabled v-model="lookform.StudentName" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="跟踪时间"><el-input disabled v-model="lookform.FollowTime" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="下次跟踪时间"><el-input disabled v-model="lookform.NextFollowTime" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="内容"><el-input disabled v-model="lookform.Content" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="咨询师"><el-input disabled v-model="lookform.UserId" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="跟踪方式"><el-input disabled v-model="lookform.FollowType" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="创建时间"><el-input disabled v-model="lookform.CreateTime" autocomplete="off"></el-input></el-form-item>

					<el-form-item label="跟踪状态"><el-input disabled v-model="lookform.FollowState" autocomplete="off"></el-input></el-form-item>
				</el-form>
			</el-dialog>
			

			<el-dialog title="请选择咨询师" :visible.sync="dialogzixunvisible">
				<el-form :model="zixunform" label-width="100px">
					<el-form-item label="咨询师">
						<el-select v-model="zixunform.AskerId" >
						      <el-option v-for="item in ZiXunShiList" :label="item.AskerName" :value="item.AskerId"></el-option>
						    </el-select>
					</el-form-item>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click="dialogzixunvisible = false">取 消</el-button>
					<el-button type="primary" @click="ZiXun">确 定</el-button>
				</div>
			</el-dialog>


			<!-- 添加 -->

		<el-dialog title="添加" :visible.sync="dialogAddFormVisible">
		  <el-form :model="Addform">
		    <el-form-item label="学生姓名" :label-width="formAddLabelWidth">
		      <el-input v-model="Addform.Name" auto-complete="off"></el-input>
		    </el-form-item>
			<el-form-item label="性别" :label-width="formAddLabelWidth">
				<el-select v-model="Addform.Sex" placeholder="--请选择--">
				  <el-option label="--请选择--" value=""></el-option>
				  <el-option label="男" value="男"></el-option>
				   <el-option label="女" value="女"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="年龄" :label-width="formAddLabelWidth">
			  <el-input v-model="Addform.Age" auto-complete="off"></el-input>
			</el-form-item>
			<el-form-item label="电话" :label-width="formAddLabelWidth">
			  <el-input v-model="Addform.Phone" auto-complete="off"></el-input>
			</el-form-item>
			<el-form-item label="QQ" :label-width="formAddLabelWidth">
			  <el-input v-model="Addform.QQ" auto-complete="off"></el-input>
			</el-form-item>
			<el-form-item label="微信" :label-width="formAddLabelWidth">
			  <el-input v-model="Addform.WeiXin" auto-complete="off"></el-input>
			</el-form-item>
			<el-form-item label="来源部门" :label-width="formAddLabelWidth">
			  <el-input v-model="Addform.MsgSource" auto-complete="off"></el-input>
			</el-form-item>
			<el-form-item label="所属咨询师" :label-width="formAddLabelWidth">
				<el-select v-model="Addform.AskerId" placeholder="--请选择--">
				  <el-option label="--请选择--" value=""></el-option>
				  <el-option v-for="item in ZiXunShiList" :label="item.AskerName" :value="item.AskerId"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="是否有效" :label-width="formAddLabelWidth">
				<el-select v-model="Addform.IsValid" placeholder="--请选择--">
				  <el-option label="--请选择--" value=""></el-option>
				  <el-option label="是" value="是"></el-option>
				   <el-option label="否" value="否"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="学历" :label-width="formAddLabelWidth">
			  <el-input v-model="Addform.StuConcern" auto-complete="off"></el-input>
			</el-form-item>
			<el-form-item label="个人状态" :label-width="formAddLabelWidth">
			  <el-input v-model="Addform.PerState" auto-complete="off"></el-input>
			</el-form-item>
			<el-form-item label="定金金额" :label-width="formAddLabelWidth">
			  <el-input v-model="Addform.Money" auto-complete="off"></el-input>
			</el-form-item>
			<el-form-item label="是否缴费" :label-width="formAddLabelWidth">
				<el-select v-model="Addform.lsPay" placeholder="--请选择--">
				  <el-option label="--请选择--" value=""></el-option>
				  <el-option label="是" value="是"></el-option>
				   <el-option label="否" value="否"></el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="金额" :label-width="formAddLabelWidth">
			  <el-input v-model="Addform.PreMoney" auto-complete="off"></el-input>
			</el-form-item>
		  </el-form>
		  <div slot="footer" class="dialog-footer">
		    <el-button @click="dialogAddFormVisible = false">取 消</el-button>
		    <el-button type="primary" @click="Add">确 定</el-button>
		  </div>
		</el-dialog>	

		</el-card>
	</div>
</template>
<script>
// import moment from 'moment';
export default {
	data() {
		return {
			formInline: {
				Name: '',
				Sex:"",
				IsValid: '',
				HomeTime: '',
				IsPay: '',
				CreateTime: '',
				AskerId: ''
			},
			zixunform:{},
			selectList: [], // 选中的数据
			zixunlist:[],
			form: {},
			editform: {},
			Followform: {},
			dayformInline: {
				startTime: '',
				endTime: '',
				FollowType: ''
			},
			lookform: {},

			Id: 0,
			count: 0,
			count2: 0,
			page: 1,
			page2: 1,
			limit2: 5,
			limit: 10,
			askvisible: false,
			menuVisible: false, //右键菜单的显示与隐藏
			top: 0, //右键菜单的位置
			left: 0,
			piliang: false,
			dialogFormVisible: false,
			dialogDayFormVisible: false,
			dialogSelectFormVisible: false,
			dialogFollowFormVisible: false,
			EditdialogFormVisibles:false,
			dialogAddFormVisible:false,
			Addform:{},
				Genform:{
					// StudentId:"",
					// StudentName:"",
				},
				dialogGenFormVisible:false,
			dialoglookvisible: false,
			dialogzixunvisible:false,
      dialogGenFormVisible:false,
			userchecklist: [],
			daytableData: [],
      ZiXunShiList:[],
			editFormrules: {
				Weight: [
					{
						required: true,
						message: '请输入分量',
						trigger: 'blur'
					}
				]
			},
			colOptions: ['编号', '用户名', '性别', '年龄', '学习方向', '备注', '咨询师', 'QQ', '微信', '电话', '是否有效', '回访情况', '创建时间', '上门时间'], //多选框的选择项
			colSelect: ['编号', '用户名', '性别', '年龄', '学习方向', '备注', '咨询师', 'QQ', '微信', '电话', '是否有效', '回访情况', '创建时间', '上门时间'],
			colData: [
				{ title: '编号', istrue: true },
				{ title: '用户名', istrue: true },
				{ title: '性别', istrue: true },
				{ title: '年龄', istrue: true },
				{ title: '学习方向', istrue: true },
				{ title: '备注', istrue: true },
				{ title: '咨询师', istrue: true },
				{ title: 'QQ', istrue: true },
				{ title: '微信', istrue: true },
				{ title: '电话', istrue: true },
				{ title: '是否有效', istrue: true },
				{ title: '回访情况', istrue: true },
				{ title: '创建时间', istrue: true },
				{ title: '上门时间', istrue: true }
			]
		};
	},
	created() {
		this.getStudentsList();
		 this.GetZiXunShiList();
	},
	watch: {
		colOptions(newVal, oldVal) {
			if (newVal) {
				//如果有值发生变化，即多选框的已选项变化
				var arr = this.colSelect.filter(i => newVal.indexOf(i) < 0); // 未选中
				this.colData.filter(i => {
					if (arr.indexOf(i.title) !== -1) {
						i.istrue = false;
					} else {
						i.istrue = true;
					}
				});
			}
		}
	},
	methods: {
		// 导出数据
		exportData() {
			if (this.selectList.length > 0) {
				this.excelData = this.selectList;
			} else {
				this.excelData = this.userchecklist; //将你要导出的数组数据（historyList）赋值给excelDate
			}

			this.export2Excel(); //调用export2Excel函数，填写表头（clomns里的type）和对应字段(historyList里的属性名)
		},
		//表格数据写入excel
		export2Excel() {
			var that = this;
			require.ensure([], () => {
				const { export_json_to_excel } = require('@/excel/Export2Excel.js');
				//这里使用绝对路径( @表示src文件夹 )，使用@/+存放export2Excel的路径【也可以写成相对于你当前"xxx.vue"文件的相对路径，例如我的页面放在assets文件夹同级下的views文件夹下的“home.vue”里，那这里路径也可以写成"../assets/excel/Export2Excel"】
				const tHeader = ['编号', '学生姓名', '性别', '年龄', '学习方向', '备注', '咨询师', 'QQ', '微信', '电话', '是否有效', '是否回访', '创建时间', '上门时间']; // 导出的excel表头名信息
				const filterVal = [
					'Id',
					'Name',
					'Sex',
					'Age',
					'LearnForward',
					'MsgSource',
					'AskerId',
					'QQ',
					'WeiXin',
					'Phone',
					'IsValid',
					'IsReturnVist',
					'CreateTime',
					'HomeTime'
				]; // 导出的excel表头字段名，需要导出表格字段名
				const list = that.excelData;
				const data = that.formatJson(filterVal, list);

				export_json_to_excel(tHeader, data, '学生信息'); // 导出的表格名称，根据需要自己命名
			});
		},
		//格式转换，直接复制即可,不需要修改什么
		formatJson(filterVal, jsonData) {
			return jsonData.map(v => filterVal.map(j => v[j]));
		},
		dateFormat: function(row, column) {
			var date = row[column.property];

			if (date == undefined) {
				return '';
			}

			return moment(date).format('YYYY-MM-DD');
		},
		//获取用户签到表
		
    async getStudentsList() {
      const { data: res } = await this.$http.get(
        "api/InStu/GetInStuList?page=" +
          this.page +
          "&limit=" +
          this.limit +
          "&Name=" +
          this.formInline.Name +
          "&Sex=" +
          this.formInline.Sex
      );
      console.log(res);
      if (res.code !== 0) {
        return this.$message.error("获取用户列表失败");
      }
      this.userchecklist = res.data;
      this.count = res.count;
	  this.piliang = res.piliang;
    },
    onSubmit() {
      this.getStudentsList();
    },
	//添加
			async Add(){
				const{data:res}=await this.$http.post('api/InStu/addstudent',this.Addform)
				if(res.code!==0){
					this.$message.error(res.msg);
				}
				else{
					this.$message.success(res.msg);
					this.getStudentsList();
					this.dialogAddFormVisible=false;
				}

			},
		//更改数据条数重载
		sizechange(val) {
			this.limit = val;
			this.getStudentsList();
		},
		//更改数据页数重载
		pagechange(val) {
			this.page = val;
			this.getStudentsList();
		},
		//更改数据条数重载
		sizechange2(val) {
			this.limit2 = val;
			this.log(this.Id);
		},
		//更改数据页数重载
		pagechange2(val) {
			this.page2 = val;
			this.log(this.Id);
		},
		search() {
			this.getStudentsList();
		},
		 // 打开编辑弹框
    async edit(Id) {
      console.log(Id);
      const { data: res } = await this.$http.get(
        "api/Students/GetStudentsById?Id=" + Id
      );
      console.log(res);
      if (res.code !== 0) {
        return this.$message.error("查询用户信息失败!");
      }
      this.dialogFormVisible = true;
      this.form = res.data;
    },
    // 编辑功能// //修改用户信息并提交
    editset() {
      console.log(this.form);
      let _this = this;
      this.$http.post("api/Students/Edit", this.form).then(function (res) {
        if (res.data.code == 0) {
          _this.$message.success(res.data.msg);
          _this.form = {};
          _this.dialogFormVisible = false;
          _this.getStudentsList();
        } else {
          _this.$message.info(res.data.msg);
        }
      });
    },
	// 删除
    del(Id) {
      console.log(id);
      let _this = this;
      this.$http.post("api/Students/Del?Id=" + Id).then(function (res) {
        if (res.data.code == 0) {
          _this.$message.success(res.data.msg);
          _this.GetStuList();
        } else {
          _this.$message.info(res.data.msg);
        }
      });
    },
		contextmenu(row, event) {
			//先把菜单关闭，目的是第二次或者第n次右键鼠标的时候 它默认的是true
			this.menuVisible = false;
			// 显示菜单
			this.menuVisible = true;
			window.event.returnValue = false; //阻止浏览器自带的右键菜单弹出
			//给整个document绑定click监听事件， 左键单击任何位置执行foo方法
			document.addEventListener('click', this.foo);
			//event对应的是鼠标事件，找到鼠标点击位置的坐标，给菜单定位
			this.top = event.clientY;
			this.left = event.clientX;
		},
		foo() {
			this.menuVisible = false; //关闭菜单栏
			document.removeEventListener('click', this.foo); //解绑click监听，很重要，具体原因可以看另外一篇博文
		},
		//详情
		studetail(row) {
			this.editform = row;
			this.dialogSelectFormVisible = true;
		},
		//我的学生跟踪
		// Gen(row){
     	// 	 console.log(row)
		// 		this.Genform=row;
		// 		this.dialogGenFormVisible=true;
		// 	},
			 async Gen(Id) {
      console.log(Id);
      const { data: res } = await this.$http.get(
        "api/Students/GetStudentsById?Id=" + Id
      );
      console.log(res);
      if (res.code !== 0) {
        return this.$message.error("查询用户信息失败!");
      }
      this.dialogGenFormVisible = true;
      this.Genform.StudentId = res.data.Id;
	  this.Genform.StudentName = res.data.Name;
    },
	GenUser(){
				this.$refs.GenFormRef.validate(async valid => {
					if (!valid) return
					const {
						data: res
					} = await this.$http.post('api/Students/GenUser', this.Genform)
					if (res.code == -1) {
						this.$message.error("跟踪失败！")
					}else{
						this.$message.success("跟踪成功！");
						this.dialogGenFormVisible = false;
						this.getStudentsList();
					}
				})
			},
      async GetZiXunShiList() {
				const {
					data: res
				} = await this.$http.post('api/Students/GetZiXunShi')
				this.ZiXunShiList = res;
				console.log(res)
			},

			
		//日志
		async log(Id) {
			this.Id = Id;
			const { data: res } = await this.$http.get('api/Customer/getstulog', {
				params: {
					StartTime: this.dayformInline.startTime,
					endTime: this.dayformInline.endTime,
					Id: this.Id,
					FollowType: this.dayformInline.FollowType,
					page: this.page2,
					limit: this.limit2
				}
			});
			this.daytableData = res.data;
			this.count2 = res.count;
			this.dialogDayFormVisible = true;
		},
		sousuo() {
			this.log(this.Id);
		},
		addClassClose() {
			this.dayformInline.startTime = '';
			this.dayformInline.endTime = '';
			this.dayformInline.FollowType = '';
			this.dialogDayFormVisible = false;
			// this.log(this.Id)
		},
		lookvisible(row) {
			this.lookform = row;
			this.dialoglookvisible = true;
		},
		//选中某条数据时
		handleSelectionChange(row) {
			this.selectList = row; // 将选中的数据给selectList
			//   console.log(this.selectList)
			console.log(row);
		},
		ZiXun(){
		console.log(this.selectList)
		let ss=this.selectList
		var ids = "";
		for (let i = 0; i < ss.length; i++) {
			ids=ids+ss[i].Id+","
		}
		ids = ids.substring(0, ids.length-1)
		console.log(ids);
		 this.$http.get('api/Students/GetPiLiang?AskerId='+this.zixunform.AskerId+"&ids="+ids).then(res=>{
			 console.log(res);
			 if(res.data.code==0){
				 this.dialogzixunvisible=false;
				 this.getStudentsList()
			 }
		 })
		},
		//批量设置咨询师
		setUser() {
			if (this.selectList.length > 0) {
				this.dialogzixunvisible=true;
				this.GetZiXunShiList()
			} else {
				return this.$message('您还没有选中哦');
			}
		},
		//获取所有咨询师
	// async	getallzixuner(){
	// 		const { data: res } = await this.$http.get('api/Customer/getallzixun'
	// 		);
	// 		this.zixunlist=res.data
	// 	}
	}
};
</script>
<style >

.menu1 {
	position: fixed;
	height: auto;
	width: 231px;
	border-radius: 3px;
	border: 1px solid #999999;
	background-color: #f4f4f4;
	padding: 10px;
	z-index: 1000;
}
.el-checkbox {
	width: 80px;
	display: compact;
	height: 20px;
	line-height: 20px;
	padding: 0 5px;
	margin-right: 0;
	font-size: 12px;
	border: 1px solid transparent;
}
.el-checkbox:hover {
	border-radius: 3px;
	border: 1px solid #999999;
}
</style>
